@media screen and (min-width: 1600px) {
    #bottomBar {
        height: 400px !important;
        &.show {
            margin-top: -400px !important;
        }
    }
    @-webkit-keyframes showBottomBar {
        0% {
            margin-top: 30px;
        }
        100% {
            margin-top: -400px;
        }
    }
    @keyframes showBottomBar {
        0% {
            margin-top: 30px !important;
        }
        100% {
            margin-top: -400px !important;
        }
    }
    @-webkit-keyframes hideBottomBar {
        0% {
            margin-top: -400px;
        }
        100% {
            margin-top: 30px;
        }
    }
    @keyframes hideBottomBar {
        0% {
            margin-top: -400px !important;
        }
        100% {
            margin-top: 30px !important;
        }
    }
}
@media screen and (max-width: 1599px) {
    #bottomBar {
        height: 350px !important;
        &.show {
            margin-top: -350px !important;
        }
    }
    @-moz-document url-prefix() {
        #bottomBar.hide {
            margin-top: 30px !important;
        }
        #bottomBar.show {
            margin-top: -350px !important;
        }
    }

    @-webkit-keyframes showBottomBar {
        0% {
            margin-top: 30px;
        }
        100% {
            margin-top: -350px;
        }
    }
    @keyframes showBottomBar {
        0% {
            margin-top: 30px !important;
        }
        100% {
            margin-top: -350px !important;
        }
    }

    @-webkit-keyframes hideBottomBar {
        0% {
            margin-top: -350px;
        }
        100% {
            margin-top: 30px;
        }
    }
    @keyframes hideBottomBar {
        0% {
            margin-top: -350px !important;
        }
        100% {
            margin-top: 30px !important;
        }
    }
}
